import {
	ref
} from "vue";
import {
	marked
} from 'marked';

export default function useArticleDetail(articleId, $http) {
	const articleData = ref(null);
	const content = ref('');

	const loadArticleDetail = async () => {
		try {
			const resp = await $http.get_article_detail({
				article_id: articleId
			});

			// 由于http.js已经直接返回result.data，直接使用resp作为文章数据对象
			const articleDataObj = resp || {};
			articleData.value = articleDataObj;

			// 确保content字段存在并正确解析
			if (articleDataObj.content) {
				try {
					// 移除可能干扰解析的零宽度字符
					const cleanContent = articleDataObj.content.replace(
						/^[\u200B\u200C\u200D\u200E\u200F\uFEFF]/, "");
					// 使用marked.parse解析markdown
					const htmlContent = marked.parse(cleanContent);
					// 简单的HTML清理（生产环境应该使用DOMPurify等专业库）
					content.value = sanitizeHTML(htmlContent);
				} catch (parseError) {
					console.error("Markdown解析失败", parseError);
					content.value = `<div class="parse-error">内容解析失败，请稍后重试</div>`;
				}
			}

			return articleDataObj;
		} catch (e) {
			console.error("加载文章失败", e);
			throw e;
		}
	};

	// 简单的HTML清理函数
	// 改进sanitizeHTML函数，特别增强对链接标签的处理
	function sanitizeHTML(html) {
		// 首先进行HTML实体解码，特别是将 &lt; 和 &gt; 解码为 < 和 >
		let cleanHtml = html
			// HTML实体解码
			.replace(/&lt;/g, '<')
			.replace(/&gt;/g, '>')
			.replace(/&quot;/g, '"')
			.replace(/&amp;/g, '&')
			.replace(/&#39;/g, "'")
			// 移除script标签和on事件处理器
			.replace(/<script\b[^<]*(?:(?!<\/script>)<[^<]*)*<\/script>/gi, '')
			.replace(/on\w+="[^"]*"/gi, '')
			.replace(/on\w+='[^']*'/gi, '')
			.replace(/on\w+=\{[^}]*\}/gi, '')
			// 专门处理a标签，确保链接的完整性
			.replace(/<a\s+href\s*=\s*(?:"([^"]*)"|'([^']*)')\s*>(.*?)<\/a>/gi, (match, href1, href2, content) => {
				const href = href1 || href2;
				// 确保href和内容都存在，并且内容不为空
				if (href && content && content.trim()) {
					return `<a href="${href}">${content}</a>`;
				}
				return match; // 如果有问题，保持原样
			})
			// 修复未闭合的标签等问题
			.replace(/<([a-z]+)([^>]*)>(.*?)(<\/\1>)?/gi, (match, tag, attrs, content, closing) => {
				if (closing) {
					return match; // 标签已闭合，保持原样
				}
				// 对于未闭合的标签，尝试添加闭合标签
				const voidTags = ['br', 'hr', 'img', 'input', 'link', 'meta', 'area', 'base', 'col', 'embed',
					'source'
				];
				if (!voidTags.includes(tag.toLowerCase())) {
					return `<${tag}${attrs}>${content}</${tag}>`;
				}
				return match;
			});

		return cleanHtml;
	}

	return {
		articleData,
		content,
		loadArticleDetail
	};
}